<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="Access-Control-Allow-Origin" content="*">
        <link type="text/css" rel="stylesheet" href="openlayer/ol.css" >
        <script type="text/javascript" src="jquery/jquery-1.8.3.js"></script>
        <title>测试Div</title>
        <style type="text/css">
			.fancy td {
				color: #f60;
				background: #666;
			}
			head,body{
			    background-color: #FFFFFF;
			    padding: 50px;
			}
        </style>
        <style type="text/css">
			[title~=hello] {
				color: red;
			}
        </style>
        <style type="text/css">
            [title|=abc]{
                color:green;
                
            }
        </style>
        
    </head>
    <body>
        <table border="1" title="abc-">
            <tr>
                <td >row 1, cell 1</td>
                <td>row 1, cell 2</td>
            </tr>
            <tr>
                <td>row 2, cell 1</td>
                <td>row 2, cell 2</td>
                <td>row 2, cell 3</td>
                <td>row 2, cell 4</td>
            </tr>
            <tr>
                <td>123</td>

            </tr>
        </table>
        <!-- <td class="fancy">111111111111</td> -->
        <p>
            <strong>我是粗体字，不是斜体字，因为我不在列表当中，所以这个规则对我不起作用</strong>
        </p>

        <ol>
            <li>
                <strong>我是斜体字。这是因为 strong 元素位于 li 元素内。</strong>
            </li>
            <li>
                我是正常的字体。
            </li>
        </ol>
        <div style="text-indent: 20% ;font-variant:small-caps">text-indent: 20%;</div>
        <script>
			var objdiv = document.createElement("div");

        </script>
    </body>
</html>